<template>
	<view class="">
		<view class="" style="width: 100%;height: 160rpx;">
			<u-navbar title="停车" :bgColor="navBgColor" :titleStyle="{ color: navColor }" fixed>
				<view slot="left"></view>
			</u-navbar>
		</view>
		<view class="cars-info" :class="{ carsinfos: current_aTab == 1}">
			<view class="conscon1">
				<!-- <u-sticky> -->
				<u-tabs :list="list4" :activeStyle="{  color: '#4BA677 ',fontWeight: 'bold', }"
					:inactiveStyle="{color: '#666666',}" lineColor="#4BA677"
					itemStyle="padding-left: 15px; padding-right: 15px; height: 38px;" :current="current_aTab"
					@click=" tab_Click" lineWidth="30"></u-tabs>
				<!-- </u-sticky> -->
			</view>
			<scroll-view scroll-y="true" style="height: 80vh;" v-if="current_aTab == 0">
				<view class="list">
					<view class="onlist">
						<view class="cars_top">
							<view class="cars_t_l">
								<view class="cars_t_l_t">
									车牌号
								</view>
								<view class="cars_t_l_b" v-if="plate_no !=''" @click="plate_list">
									{{plate_no?plate_no:''}}<text style="margin-left: 10rpx;">></text>
								</view>
								<view class="cars_t_l_b" v-else @click="plate_list">
									请添加车牌<text style="margin-left: 10rpx;">></text>
								</view>
								<view class="cars_t_l_b" v-else>
									<text style="margin-left: 10rpx;">></text>
								</view>
							</view>
							<view class="cars_t_r" @click="add">
								<image style="width: 20rpx;height: 20rpx;" :src="jiahao1" mode=""></image>
								<text style="margin-left: 6rpx;">添加车牌号</text>
							</view>
						</view>
						<view class="cars_xian"></view>
						<view class="onlist_on">
							<view class="onlist_left" v-if="check_on == 1">
								<view class="onlist_l_l">
									停车费用
								</view>
								<view class="onlist_l_r" v-if="infoarr.order_money">
									¥{{amountFixed(infoarr.order_money - infoarr.deduct_amount)}}
								</view>
								<view class="onlist_l_r" v-else>
									¥0.00
								</view>
							</view>
							<view class="onlist_left" v-if="check_on == 0">
								<view class="onlist_l_l">
									停车费用
								</view>
								<view class="onlist_l_r" v-if="infoarr.order_money">
									¥{{infoarr.order_money?infoarr.order_money:''}}
								</view>
								<view class="onlist_l_r" v-else>
									¥0.00
								</view>
							</view>
							<!-- 在选中优惠的时候判断是否有选中对应优惠券 -->
							<view class="onlist_left" v-if="check_on == 2">
								<view class="" v-if="couponlist.coupon_id != ''">
									<view class="onlist_l_l">
										停车费用
									</view>
									<view class="onlist_l_r" v-if="infoarr.order_money">
										¥{{amountFixed(infoarr.order_money)}}
									</view>
									<view class="onlist_l_r" v-else>
										¥0.00
									</view>
								</view>
								<view class="" v-else>
									<view class="onlist_l_l">
										停车费用
									</view>
									<view class="onlist_l_r" v-if="infoarr.order_money">
										¥{{amountFixed(infoarr.order_money - infoarr.deduct_amount)}}
									</view>
									<view class="onlist_l_r" v-else>
										¥0.00
									</view>
								</view>
							</view>
							<view class="onlist_right">
								<view class="onlist_r_l">
									<text>停车时长</text>
								</view>
								<view class="onlist_r_r">
									<text v-if="infoarr.time_lon">{{infoarr.time_long?infoarr.time_long:''}}</text>
									<text v-else>{{infoarr.time_long?infoarr.time_long:''}}</text>
								</view>
							</view>
						</view>
						<view class="cars_xian"></view>
						<view class="onlist_on">
							<view class="onlist_left">
								<view class="onlist_l_l">
									入场时间
								</view>
								<view class="onlist_l_r" v-if="infoarr.in_time">
									{{infoarr.in_time?infoarr.in_time:''}}
								</view>
								<view class="onlist_l_r" v-else>
									无入场时间
								</view>
							</view>
						</view>
					</view>
					<view class="on_list">
						<view class="on_list_left">
							<view class="on_list_l_l">
								停车地点
							</view>
							<view class="on_list_l_r" v-if="infoarr.park_name">
								{{infoarr.park_name?infoarr.park_name:''}}
							</view>
							<view class="on_list_l_r" v-else>
								暂无
							</view>
						</view>
					</view>
					<!-- 积分抵扣 -->
					<!-- <view class="on_list" >
						<view class="on_list_left">
							<view class="on_list_l_l">
								积分{{ jifen || '0' }}（{{infoarr.need_use || 0}}积分抵扣:{{infoarr.deduct_amount || 0}}元）
							</view>
							<checkbox-group shape="circle">
								<label class="item flex-align" >
									<view class="radioBox" style="padding-left: 34rpx">
										<checkbox color="#4BA677"  checked="false"/>
									</view>
									<view class="flex-align">
										<view class="on_list_l_r" v-if="infoarr.pay_amount">
											{{infoarr.pay_amount?infoarr.pay_amount:''}}
										</view>
										<view class="on_list_l_r" v-else>
											暂无
										</view>
									</view>
								</label>
							</checkbox-group>
							<checkbox-group @change="radioChecked1">
								<label class="item flex-align">
									<view class="flex-align">
										<view class="on_list_l_r">
											<text></text>
										</view>
									</view>
									<view class="radioBox">
										<checkbox :value="true" color="#4BA677" />
									</view>

								</label>
							</checkbox-group>
						</view>
					</view> -->
					<view class="form">
						<radio-group @change='change1'>
							<label class="item flex-align">
								<view class="flex-between item-con">
									<view class="">
										积分{{ jifen || '0' }}（{{infoarr.need_use || 0}}积分抵扣:{{infoarr.deduct_amount || 0}}元）
									</view>
									<radio :value="1" color="#4BA677" :disabled="jifen > 0 ? false : true" />
								</view>
							</label>
							<label class="item flex-align">
								<view class="flex-between item-con">
									<view class="" @click="showCoupons = true">
										优惠券
										<text style="color: #000000;"
											v-if="couponlist.coupon_id == ''">（{{wrapperlist.length}}张）</text>
										<text style="color: #000000;" v-else>（{{couponlist.coupon_name }}）</text>
									</view>
									<radio :value="2" color="#4BA677"
										:disabled="wrapperlist.length > 0 ? false : true" />
								</view>
							</label>
						</radio-group>
					</view>

					<view class="on_list">
						<view class="on_list_left" style="padding-bottom: 10rpx;">
							<view class="on_list_l_l">
								总费用
							</view>
							<view class="on_list_l_r" v-if="infoarr.total_money">
								¥{{infoarr.total_money?infoarr.total_money:''}}
							</view>
							<view class="on_list_l_r" v-else>
								¥0.00
							</view>
						</view>
						<view class="on_list_left" style="padding-bottom: 10rpx;">
							<view class="on_list_l_l" v-if="check_on != 2">
								累计折扣
							</view>
							<view class="on_list_l_r" v-if="check_on == 1" style="color: red;">
								¥{{amountFixed(infoarr.deduct_amount || 0)	}}
							</view>
							<!-- 在选中优惠的时候判断是否有选中对应优惠券 -->
							<!-- <view class="on_list_l_r" v-if="check_on == 2">
								<text
									v-if="couponlist.coupon_id != ''">¥{{amountFixed(infoarr.deduct_amount || 0)	}}</text>
								<text v-else>¥0.00</text>
							</view> -->
							<view class="on_list_l_r" v-if="check_on == 0">
								¥0.00
							</view>
						</view>
						<view class="on_list_left" style="padding-bottom: 10rpx;" v-if="check_on == 1">
							<view class="on_list_l_l">
								应付费用
							</view>
							<view class="on_list_l_r" v-if="infoarr.order_money">
								¥{{amountFixed(infoarr.order_money - infoarr.deduct_amount)}}
							</view>
							<view class="on_list_l_r" v-else>
								¥0.00
							</view>
						</view>
						<view class="on_list_left" style="padding-bottom: 10rpx;" v-if="check_on == 0">
							<view class="on_list_l_l">
								应付费用
							</view>
							<view class="on_list_l_r" v-if="infoarr.order_money">
								¥{{infoarr.order_money?infoarr.order_money:''}}
							</view>
							<view class="on_list_l_r" v-else>
								¥0.00
							</view>
						</view>
						<!-- 在选中优惠的时候判断是否有选中对应优惠券 -->
						<view class="on_list_left" style="padding-bottom: 10rpx;" v-if="check_on == 2">
							<view class="on_list_l_l">
								应付费用
							</view>
							<view class="" v-if="couponlist.coupon_id != ''">
								<view class="on_list_l_r" v-if="infoarr.order_money">
									¥{{amountFixed(infoarr.order_money)}}
								</view>
								<view class="on_list_l_r" v-else>
									¥0.00
								</view>
							</view>
							<view class="" v-else>
								<view class="on_list_l_r" v-if="infoarr.order_money">
									¥{{amountFixed(infoarr.order_money - infoarr.deduct_amount)}}
								</view>
								<view class="on_list_l_r" v-else>
									¥0.00
								</view>
							</view>
						</view>
					</view>
					<view class="bottom-addbtn" v-if="infoarr.total_money > 0">
						<u-button text="立即缴费" shape="circle" @click="$noMultipleClicks(onmoney)" :disabled="isDisabled"
							color="linear-gradient( 270deg, #47B37B 0%, #69D19B 100%, #4BA677 0%)"></u-button>
					</view>
					<view class="bottom-addbtn" v-else>
						<u-button text="无需缴费" shape="circle"
							color="linear-gradient( 270deg, #c6c6c6 0%, #e3e3e3 100%, #c8c8c8 0%)"></u-button>
					</view>
					<view class="cars_text">
						<view class="cars_t_w">
							苏州市体育中心停车收费标准:
						</view>
						<view class="cars_t_s" v-for="(item,index) in standard_list" :key="index">
							{{item}}
						</view>
						<view class="cars_t_w">
							说明:
						</view>
						<view class="cars_t_s" v-for="(item,index) in remark_list" :key="index">
							{{item}}
						</view>
					</view>
				</view>
				<u-picker :show="show" :columns="columns" keyName="plate_no" @confirm="confirm" @cancel="show = false"
					closeOnClickOverlay></u-picker>
				<!-- <view class="bottom-add-btn" v-if="current_aTab == 0">
					<u-button text="立即缴费" shape="circle" @click="onmoney"
						color="linear-gradient( 270deg, #47B37B 0%, #69D19B 100%, #4BA677 0%)"></u-button>
				</view>
				<view class="bottom-add-btn" v-if="current_aTab == 1">
					<u-button text="智慧寻车" shape="circle"
						color="linear-gradient( 270deg, #47B37B 0%, #69D19B 100%, #4BA677 0%)"></u-button>
				</view> -->
			</scroll-view>


			<scroll-view scroll-y="true" style="height: 60vh;" v-if="current_aTab == 1">
				<view class="cons_con">
					<view class="" style="width: 100%;height: 20rpx;background-color: #F4F9F9;">

					</view>
					<view class="conscon1">
						<u-sticky>
							<u-tabs :list="list1" :activeStyle="{  color: '#4BA677 ',fontWeight: 'bold', }"
								:inactiveStyle="{color: '#666666',}" lineColor="#4BA677"
								itemStyle="padding-left: 15px; padding-right: 15px; height: 38px;" :current="currentTab"
								@click=" tabClick"></u-tabs>
						</u-sticky>
					</view>

					<view class="add_list">
						<image class="add_li_img" :src="po48" mode="" v-if="list3 !=''" @click="onPreview"></image>
						<view class="group_9" v-else>
							<u-empty text="此楼层无智慧车场"
								icon="https://oss.szsportscenter.cn/img/58d1bf2665b8c20e302f02c56274f0ce972df8b4.png" />
						</view>
						<view class="add_li_right" v-for="(item,index) in list3" :key="index" v-if="list3.length>1"
							:class="{ resize: index === gjindex }" @click="loucheng(item,index)">
							{{item.name}}F
						</view>
					</view>
					<view class="box_1" v-for="(item,index) in communallist" :key="index">
						<view class="box_4">
							<view class="image-text_1">
								<view class="section_1"></view>
								<text lines="1" class="text-group_1">{{item.parking_name|| ''}}车场剩余数量</text>
							</view>
						</view>
						<view class="list_1">
							<view class="list-items_1-0">
								<!-- <text lines="1" class="text_4-1">{{item.name}}</text> -->
								<view class="list-items_1-1">
									<view class="list-items_1-6">
										<!-- <image style="width: 32rpx;height: 32rpx;" :src="po68" mode=""></image> -->
										<text lines="1" class="text_3-0"
											style="font-size: 40rpx;color: #1677FE;font-size: 600;">{{item.total || 0}}</text>
										<text lines="1" class="text_3-0" style="margin-top: 10rpx;">车位总数</text>
									</view>
									<text lines="1" class="text_3-1"></text>
									<view class="list-items_1-6">
										<!-- <image style="width: 32rpx;height: 32rpx;" :src="po67" mode=""></image> -->
										<text lines="1" class="text_4-0"
											style="font-size: 40rpx;color: #F2943D;font-size: 600;">{{item.used || 0}}</text>
										<text lines="1" class="text_4-0" style="margin-top: 10rpx;">占用车位</text>
									</view>
									<text lines="1" class="text_3-2"></text>
									<view class="list-items_1-6">
										<!-- <image style="width: 32rpx;height: 32rpx;" :src="po64" mode=""></image> -->
										<text lines="1" class="text_4-0"
											style="font-size: 40rpx;color: #2EB38A;font-size: 600;">{{item.free || 0}}</text>
										<text lines="1" class="text_4-0" style="margin-top: 10rpx;">剩余车位</text>
									</view>

								</view>
							</view>
						</view>
						<!-- <text lines="1" class="text_5">更多记录</text> -->
					</view>
					<view class="bottom-add-btn" @click="onwebview">
						<u-button text="智慧寻车" shape="circle"
							color="linear-gradient( 270deg, #47B37B 0%, #69D19B 100%, #4BA677 0%)"></u-button>
					</view>
					<!-- <rich-text :nodes="buy_content"></rich-text> -->
					<!-- <web-view :src="agree_url"></web-view> -->
				</view>

				<!-- <view class="bottom-add-btn" v-if="current_aTab == 0">
					<u-button text="立即缴费" shape="circle" @click="onmoney"
						color="linear-gradient( 270deg, #47B37B 0%, #69D19B 100%, #4BA677 0%)"></u-button>
				</view>
				<view class="bottom-add-btn" v-if="current_aTab == 1">
					<u-button text="智慧寻车" shape="circle"
						color="linear-gradient( 270deg, #47B37B 0%, #69D19B 100%, #4BA677 0%)"></u-button>
				</view> -->
			</scroll-view>
		</view>

		<u-popup border-radius="14" mode='center' :mask-close-able="false" :closeable="false" :show="showPopup">
			<view class="not-logged-in">
				<view class="title">授权小程序</view>
				<u-image width="113" height="90" :src="logosrc" v-if="logosrc != ''"></u-image>
				<u-image width="113" height="90" :src="icon2" v-else></u-image>
				<view class="desc">需要手机号授权登录</view>
				<view class="btns">
					<button class="btn2" @click="cancelogin">取消授权</button>
					<button class="btn" open-type="getPhoneNumber" @getphonenumber="onGetPhoneNumber">立即授权</button>
				</view>
			</view>
		</u-popup>

		<!-- 优惠卷弹窗 -->
		<u-popup @touchmove.stop :show="showCoupons" @close="closeCoupons" closeOnClickOverlay mode="bottom"
			style="position: absolute;z-index: 999;height: 30vh;" :safeAreaInsetTop="false" round="15">
			<view class="store-popup">
				<view class="title flex-between">
					<text>优惠券</text>
					<u-icon @click="closeCoupons1" name="close-circle-fill" color="#dde3e8" size="18"></u-icon>
				</view>
				<view class="" v-if="wrapperlist.length > 0 ">
					<scroll-view :scroll-top="scrollTop" scroll-y="true" class="list-1">
						<view class="item flex-align" v-for="(item,index) in wrapperlist" :key="index"
							@click="yhjlist(item)">
							<view class="item-1">
								<view class="price"><text>{{ parseInt(item.jian) }}</text> 分钟</view>
								<view class="price-1">免费</view>
							</view>
							<view class="item-2">
								<view class="info-1">{{ item.name }}</view>
								<view class="info-2">有效期至：{{ item.expire_time }}</view>
								<!-- <view class="radio">
									<u-radio-group v-model="couponsValue">
										<u-radio :name="item" activeColor="#4BA677"></u-radio>
									</u-radio-group>
								</view> -->
							</view>
						</view>
					</scroll-view>
				</view>
				<view class="list-1" v-else>
					<u-empty text="暂无数据"
						icon="https://oss.szsportscenter.cn/img/58d1bf2665b8c20e302f02c56274f0ce972df8b4.png" />
				</view>
			</view>
		</u-popup>
		<tabber :active="3"></tabber>
	</view>
</template>

<script>
	const index = require("@/api/index/index.js");
	const subscribe = require('@/api/subscribe/index.js');
	const personal = require('@/api/personal/index.js')
	export default {
		data() {
			return {
				noClick: true,
				navBgColor: 'rgba(255, 255, 255, 0)',
				navColor: '#000000',
				show: false,
				columns: [],
				plate_no: '',
				nums: '',
				timer: null,
				infoarr: {
					order_money: '',
					total_money: "",
					park_name: '',
					in_time: '',
					time_long: ''
				},
				venue_id: '',
				list4: [{
					name: '停车缴费'
				}, {
					name: '智慧车场'
				}],
				current_aTab: 0,
				po66: this.$https.assetsPath + 'po66.png',
				po50: this.$https.assetsPath + 'po50.png',
				po68: this.$https.assetsPath + 'po68.png',
				po67: this.$https.assetsPath + 'po67.png',
				po64: this.$https.assetsPath + 'po64.png',
				jiahao1: this.$https.assetsPath + 'jiahao1.png',
				icon2: this.$https.assetsPath + 'db34b1cd242d406763397f09ca0aa8e2371b81d4.png',
				po48: '',
				currentTab: 0,
				gjindex: 0,
				list1: [],
				list2: [],
				currentTab: 0,
				current_Tab: 0,
				gjindex: 0,
				list3: [],
				cate_id: '',
				floorindex: '',
				venue_id: '',
				splist: [],
				communallist: {
					free: '',
					total: '',
					used: '',
				},
				standard_list: [],
				remark_list: [],
				itemlist: {},
				Preimg: [],
				isChecked: false, // 初始状态为未选中
				isCoupon: false, // 初始状态为未选中
				checkboxValue: 'uniqueValue', // 复选框的值，需要与 checkbox 的 value 属性匹配
				jifen: 0,
				need_use: '',
				reslist: {},
				showPopup: false,
				logosrc: uni.getStorageSync("heading"),
				loginCode: "",
				onjifen: true,
				showCoupons: false,
				offCoupon: false,
				wrapperlist: [],
				couponlist: {
					coupon_id: '',
					coupon_name: ''
				},
				incurrent: 0,
				indexradio: 1,
				payList: [{
						name: '积分'
					},
					{
						name: '优惠券'
					}
				],
				check_on: 0,
				isDisabled: false,
			}
		},

		onLoad(option) {
			this.couponlist.coupon_id = ''
			this.couponlist.coupon_name = ''
			this.check_on = 0
			this.need_use = ''
			let that = this
			uni.login({
				success(res) {
					that.loginCode = res.code
				}
			})
			this.venue_id = option.venues_id
			this.plate_no = ''
			this.itemlist = option.item
			if (option.item) {
				const item = JSON.parse(decodeURIComponent(option.item));
				this.plate_no = item.plate_no
				this.plateinfo()
			} else {
				this.platelist()
			}
			this.rules()
			// this.getOverTime();
		},
		onShow() {
			this.isDisabled = false; // 事件处理完毕后重新启用按钮
			this.couponlist.coupon_id = ''
			this.couponlist.coupon_name = ''
			// this.check_on = 0
			// this.need_use = 0
			// this.jifen = ''
			// if (!uni.getStorageSync("openid")) {
			// 	uni.showToast({
			// 		title: '请先登录！',
			// 		icon: 'none',
			// 		duration: 1000
			// 	});
			// 	setTimeout(() => {
			// 		uni.navigateTo({
			// 			url: "/pages/personal/personal"
			// 		})
			// 	}, 1800)
			// } else {
			// 	let phone = uni.getStorageSync('phone')
			// 	if (!phone) {
			// 		this.showPopup = true
			// 	} else {
			// 		this.showPopup = false
			// 	}
			// }
			let phone = uni.getStorageSync('phone')
			if (!phone) {
				this.showPopup = true
			} else {
				this.showPopup = false
			}
			this.plate_no = ''
			this.columns = []
			this.infoarr = ''
			let that = this;
			// that.timer = null;
			// clearTimeout(that.timer);
			// that.timer = setTimeout(() => {
			// 	this.getOverTime();
			// }, 60000);

			if (this.itemlist) {
				const item = JSON.parse(decodeURIComponent(this.itemlist));
				this.plate_no = item.plate_no
				this.plateinfo()
			} else {
				this.platelist()
			}
			this.getPoints()
			this.getMyParkCoupon()
			this.getAppletConfig()
		},
		// 一般页面用onUnload
		onUnload() {
			if (this.timer) {
				clearTimeout(this.timer);
				this.timer = null;
			}
		},
		// tabbar页面用onHide
		onHide() {
			if (this.timer) {
				clearTimeout(this.timer);
				this.timer = null;
			}
		},
		methods: {
			//选择优惠卷
			yhjlist(item) {
				this.isDisabled = true;
				this.couponlist.coupon_id = item.coupon_id
				this.couponlist.coupon_name = item.name
				this.showCoupons = false
				this.plateinfo()
			},
			// 关闭优惠券/取消选中优惠券
			closeCoupons1() {
				this.couponlist.coupon_id = ''
				this.couponlist.coupon_name = ''
				this.showCoupons = false;
				this.plateinfo()
			},
			closeCoupons() {
				this.showCoupons = false;
			},
			onGetPhoneNumber(e) {
				var _this = this
				if (e.detail.errMsg == 'getPhoneNumber:fail user deny') {
					uni.showToast({
						title: '获取用户信息失败',
						icon: 'none', //如果要纯文本，不要icon，将值设为'none'
						duration: 2000 //持续时间为 2秒
					})
				} else {
					// 获取手机号并解密
					uni.checkSession({
						success() {
							// session未过期,并且在本生命周期一直有效 (这里可以不写代码)
						},
						fail() {
							// session_key已失效,需要重新登录流程并更新code
							uni.login({
								success(res) {
									_this.loginCode = res.code
								}
							})
						},
						complete() {
							// 将code,iv,encryptedData传给后端进行解密
							let params = {
								appid: _this.$https.weixinAppId,
								encryptedData: e.detail.encryptedData,
								iv: e.detail.iv,
								code: _this.loginCode,
								project_id: getApp().globalData.projectId,
								references: uni.getStorageSync("openidlist"),
								invite_code: uni.getStorageSync("codescene") //二维码用户openid
							}
							_this.appletPhoneLogin(params)
						}
					})

				}
			},
			cancelogin() {
				this.showPopup = false
			},
			async appletPhoneLogin(params) {
				let that = this
				let data = params
				let result = await personal.appletPhoneLogin(data)
				if (result.code == 1) {
					uni.setStorageSync('phone', result.data.phone)
					uni.setStorageSync('openid', result.data.openid)
					that.showPopup = false
					if (this.itemlist) {
						const item = JSON.parse(decodeURIComponent(this.itemlist));
						this.plate_no = item.plate_no
						this.plateinfo()
					} else {
						this.platelist()
					}
					this.getPoints()
					this.getMyParkCoupon()
					this.getAppletConfig()
				} else {
					uni.showToast({
						icon: 'none',
						mask: true,
						title: '授权失败，请稍后再试'
					})
				}
			},
			onwebview() {
				wx.navigateToMiniProgram({
					appId: 'wx77e84f365164f150',
					path: 'pages/Index/Index?url=https%3a%2f%2fwx.parkingwang.com%2ffind_car%2finput_vpl',
					extraData: {
						// 可选，传递给目标小程序的数据，具体格式自定义
					},
					envVersion: 'release', // 可选，跳转到目标小程序的版本，可选值为 develop（开发版）、trial（体验版）、release（正式版）
					success(res) {
						// 跳转成功的回调
					},
					fail(err) {
						// 跳转失败的回调
					}
				});
			},
			// 金额计算保留两位小数
			amountFixed(value) {
				return parseFloat(value).toFixed(2);
			},
			//获取积分
			async getPoints() {
				let params = {
					app_id: this.$https.weixinAppId,
					project_id: getApp().globalData.projectId,
					open_id: uni.getStorageSync('openid'),
				};
				let res = await personal.getPoints(params);
				if (res.code === 1) {
					this.jifen = res.data.point
				}
			},
			
			//获取优惠券
			async getMyParkCoupon() {
				let params = {
					app_id: this.$https.weixinAppId,
					project_id: getApp().globalData.projectId,
					open_id: uni.getStorageSync('openid'),
				};
				let res = await index.getMyParkCoupon(params);
				if (res.code === 1) {
					this.wrapperlist = res.data.result
				}
			},
			change1(e) {
				console.log(e, 'eeeee')
				let that = this
				let i = e.detail.value
				 this.selectedRadio = e.detail.value
				this.check_on = i
				console.log(i, 'iiiiii')
				if (i == 2) {
					// if (that.wrapperlist.length > 0) {
					that.showCoupons = true
					that.getMyParkCoupon()
					that.need_use = ''
					// }
				} else if (i == 1) {
					that.showCoupons = false
					this.couponlist.coupon_id = ''
					this.couponlist.coupon_name = ''
					this.need_use = this.infoarr.need_use
				}
				that.plateinfo()
			},
			radioChecked1(e) {
				// 获取选中的复选框的值
				let values = e.detail.value;
				// 初始化状态为 false
				let isChecked = false;
				// 检查复选框的值是否包含 'true'
				if (values.includes('true')) {
					isChecked = true;
				}
				// 打印选中状态
				this.isChecked = isChecked
				if (isChecked == true) {
					this.onjifen = true
				} else {
					this.onjifen = true
				}
			},

			tab_Click(item) {
				this.couponlist.coupon_id = ''
				this.couponlist.coupon_name = ''
				this.check_on = 0
				this.need_use = 0
				this.current_aTab = item.index;
				if (item.index == 0) {
					this.platelist()
				} else {
					this.getSeCondVenue()
					this.communal()
				}
			},
			async platelist() {
				let that = this
				let data = {
					open_id: uni.getStorageSync('openid'),
				}
				let result = await index.platelist(data)
				if (result.code == 1) {
					that.columns.push(
						result.data.result
					)
					if (result.data.result != '') {
						that.plate_no = result.data.result[0].plate_no;
						that.plateinfo()
					}
				}
			},

			async rules() {
				let that = this
				let data = {

				}
				let result = await index.rules(data)
				if (result.code == 1) {
					this.standard_list = result.data.standard_list
					this.remark_list = result.data.remark_list
				}
			},
			// 查询停车费
			async plateinfo() {
				let that = this
				let data = {
					open_id: uni.getStorageSync('openid'),
					plate_no: this.plate_no,
					coupon_id: this.couponlist.coupon_id
				}
				let result = await index.plateinfo(data)
				if (result.code == 1) {
					this.infoarr = result.data.result
					this.isDisabled = false; // 事件处理完毕后重新启用按钮
				} else {
					uni.showToast({
						title: result.info,
						icon: 'none',
						duration: 1000
					});
					this.infoarr = {}
					this.isDisabled = false; // 事件处理完毕后重新启用按钮
				}
			},
			async plate_list() {
				let that = this
				that.columns = []
				let data = {
					open_id: uni.getStorageSync('openid'),
				}
				let result = await index.platelist(data)
				if (result.code == 1) {
					this.show = true
					that.columns.push(
						result.data.result
					)
				}
			},
			getOverTime() {
				let time = '0:59:59'
				var len = time.split(':')
				if (len.length == 3) {
					var hour = time.split(':')[0];
					var min = time.split(':')[1];
					var sec = time.split(':')[2];
				}

				if (len.length == 2) {
					var min = time.split(':')[0];
					var sec = time.split(':')[1];
				}
				if (len.length == 1) {
					var sec = time.split(':')[0];
				}

				let hours = hour; //初始化
				let minutes = min; //初始化
				let seconds = sec; //初始化
				let millisecond = 0; //毫秒

				if (hours < 10) {
					hours = "0" + hours;
				}
				if (minutes < 10) {
					minutes = "0" + minutes;
				}

				if (seconds < 10) {
					seconds = "0" + seconds;
				}
				this.timer = setInterval(() => {
					millisecond = millisecond + 50;
					if (millisecond >= 1000) {
						millisecond = 0;
						var a = 1;
						seconds = Number(seconds) + Number(a)
					}
					if (seconds >= 60) {
						seconds = 0;
						var b = 1;
						minutes = Number(minutes) + Number(b)
					}

					if (minutes >= 60) {
						minutes = 0;
						var c = 1;
						hours = Number(hours) + Number(c)
					}
					this.nums = hours + ':' + minutes + ':' + seconds;
				}, 50);
			},
			add() {
				uni.navigateTo({
					url: './cars-info'
				});
			},
			confirm(e) {
				// console.log('33')
				this.couponlist.coupon_id = ''
				this.couponlist.coupon_name = ''
				this.show = false
				this.plate_no = e.value[0].plate_no
				this.columns = []
				this.plateinfo()
			},
			// 查询停车费-创建订单
			async onmoney() {
				let that = this
				this.isDisabled = true;
				this.plateinfo()
				// if (this.infoarr.order_money > 0) {
				// if (this.isChecked == true) {
				// 	this.need_use = this.infoarr.need_use
				// } else {
				// 	this.need_use = ''
				// }
				// 选中优惠券2   // 选中积分1
				if (this.check_on == 1) {
					this.need_use = this.infoarr.need_use
				} else if (this.check_on == 2) {
					this.coupon_id = this.couponlist.coupon_id
				} else {
					this.need_use = ''
					this.coupon_id = ''
				}
				that.columns = []
				let data = {
					open_id: uni.getStorageSync('openid'),
					plate_no: this.plate_no,
					pay_amount: this.infoarr.pay_amount,
					venue_id: this.venue_id,
					project_id: getApp().globalData.projectId,
					point: this.need_use,
					coupon_id: this.couponlist.coupon_id
				}
				console.log(data, 'data')
				let result = await index.platecreate(data)
				if (result.code == 1) {
					that.reslist = result.data.result
					if (result.data.result.order_money > 0) {
						uni.navigateTo({
							url: "/page_venues/pages/venuesDetail/pay/payover?amount=" +
								that.reslist.order_money + "&venue_id=" +
								that.venue_id + "&order_id=" + result.data.result.order_id + "&orderid=" +
								result.data.result.id + "&order_type=" + result.data.result.order_type +
								"&chaoshitype=" + 2 + "&plate_no=" + that.plate_no + "&coupon_id=" + that
								.couponlist.coupon_id + "&order_item_id=" +
								result.data.result.order_item_id,
							
						});
						that.plateinfo()
					} else {
						that.enterSuccess()
					}
				} else {
					uni.$u.toast(result.info);
					this.plateinfo()
				}
				// } else {
				// 	// uni.showToast({
				// 	// 	title: "无需缴费",
				// 	// 	icon: "none",
				// 	// });
				// 	this.plateinfo()
				// 	that.enterSuccess()
				// }
			},

			// 输入正确的回调
			async enterSuccess() {
				var that = this;
				// 查询停车费-余额0发起支付
				let data = {
					open_id: uni.getStorageSync('openid'),
					plate_no: this.reslist.plate_no,
					id: this.reslist.id,
					// pay_amount: this.amount,
					// venue_id: this.venue_id,
					project_id: getApp().globalData.projectId,
					order_id: this.reslist.order_id,
					pay_type: '',
					app_id: this.$https.weixinAppId,
					order_item_id: this.reslist.order_item_id,
					coupon_id: this.couponlist.coupon_id
				}
				let res = await index.platepay(data)
				if (res.code == 1) {
					uni.hideLoading();
					this.couponlist.coupon_id = ''
					this.couponlist.coupon_name = ''
					uni.showToast({
						title: res.info,
						icon: 'none',
						mask: true
					})
					that.getPoints()
					that.getMyParkCoupon()
					that.plateinfo()
				} else {
					uni.hideLoading();
					uni.showToast({
						title: res.info,
						icon: 'none',
						mask: true
					})
					that.getPoints()
					that.getMyParkCoupon()
					that.plateinfo()
				}
			},

			async getAppletConfig() {
				let that = this
				let data = {
					'weixinAppId': this.$https.weixinAppId,
					'projectId': getApp().globalData.projectId,
				}
				let result = await index.index(data)
				if (result.code == 1) {
					this.venue_id = result.data.venue
				}
			},

			// 获取分类商品
			async getSeCondVenue() {
				let data = {
					mod: 1
				}
				let result = await subscribe.getSeCondVenue(data)
				if (result.code == 1) {
					this.list1 = result.data
					this.list3 = result.data[0].floor
					this.po48 = result.data[0].floor[0].toilet_img
					this.venue_id = result.data[0].id
					this.floorindex = result.data[0].floor[0].name
					this.Preimg = [result.data[0].floor[0].toilet_img]
				}
			},
			// 获取店铺商品
			async communal() {
				let data = {
					project_id: '',
					venue_id: '',
					type: '',
					output: 'json'
				}
				let result = await subscribe.parkcommunal(data)
				if (result.code == 1) {
					this.communallist = result.data
				}
			},
			loucheng(item, index) {
				// this.current_Tab = 0
				this.gjindex = index
				this.po48 = item.toilet_img
				this.floorindex = item.name
				// this.communal()
			},
			tabClick(item) {
				this.po48 = ''
				this.list2 = []
				this.splist = []
				this.gjindex = 0
				this.current_Tab = 0
				this.currentTab = item.index;
				this.list3 = item.floor
				this.po48 = item.floor[0].toilet_img
				this.venue_id = item.id
				this.floorindex = item.floor[0].name
				this.communal()
			},
			onPreview() {
				this.onPreviewTap()
			},
			// 预览图片
			onPreviewTap() {
				uni.previewImage({
					urls: this.Preimg,
					current: this.Preimg[0]
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.not-logged-in {
		width: 619rpx;
		height: 508rpx;
		background-color: #FFFFFF;
		position: fixed;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		z-index: 999999;
		border-radius: 10rpx;

		.title {
			font-size: 36rpx;
			font-weight: bold;
			color: #000000;
			text-align: center;
			padding-top: 43rpx;
		}

		.close {
			color: #AAAAAAFF;
			font-size: 40rpx;
			font-weight: bold;
			position: absolute;
			right: 30rpx;
			top: 20rpx;
		}

		/deep/ .u-image {
			margin: auto;
			margin-top: 52rpx;
		}

		.desc {
			font-size: 30rpx;
			color: #000000;
			font-weight: bold;
			text-align: center;
			margin-top: 20rpx;
		}

		.desc2 {
			color: #ADADADFF;
			font-size: 26rpx;
			text-align: center;
			margin-top: 18rpx;
		}

		.btns {
			display: flex;

			.btn {
				width: 50%;
				height: 100rpx;
				position: absolute;
				bottom: 0;
				right: 0;
				display: flex;
				justify-content: center;
				align-items: center;
				font-size: 34rpx;
				color: #4BA677;
				border-top: 1px solid #E6E6E6FF;
			}

			.btn2 {
				width: 50%;
				height: 100rpx;
				position: absolute;
				bottom: 0;
				display: flex;
				justify-content: center;
				align-items: center;
				font-size: 34rpx;
				color: #000;
				border-top: 1px solid #E6E6E6FF;
			}
		}
	}

	.cars-info {
		width: 100%;
		min-height: 100%;
		background-color: #EDF5F5;
		margin-bottom: 100rpx;
	}

	.carsinfos {
		min-height: 100vh;
		width: 100%;
		background-color: #ffffff;
	}

	.conscon1 {

		// padding: 0 0 20rpx 0;
		/deep/.u-tabs {
			background-color: #fff;
			// margin: 0 30rpx;

			.u-tabs__wrapper__nav__item {
				flex: 1;
			}

			.u-tabs__wrapper__nav__line {
				bottom: 0;
				z-index: 99;
			}
		}
	}

	.list {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;

		.onlist {
			width: 96%;
			height: auto;
			background-color: #fff;
			border-radius: 20rpx;
			padding: 30rpx 0 30rpx 30rpx;
			display: flex;
			flex-direction: column;
			justify-content: center;
			margin-top: 20rpx;

			.cars_top {
				display: flex;
				flex-direction: row;
				justify-content: space-between;

				.cars_t_l {
					display: flex;
					flex-direction: column;
					font-size: 26rpx;

					.cars_t_l_t {
						color: #aaaaaa;
					}

					.cars_t_l_b {
						color: #000;
						font-weight: 600;
						margin-top: 10rpx;
					}
				}

				.cars_t_r {
					width: 190rpx;
					height: 75rpx;
					background: linear-gradient(270deg, #47B37B 0%, #69D19B 100%, #4BA677 0%);
					font-size: 26rpx;
					color: #fff;
					border-radius: 75rpx 0 0 75rpx;
					// text-align: center;
					// line-height: 75rpx;
					display: flex;
					flex-direction: row;
					align-items: center;
					justify-content: center;
				}
			}

			.onlist_on {
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				margin-top: 30rpx;

				.onlist_left {
					display: flex;
					flex-direction: column;
					// align-items: center;
					font-size: 26rpx;

					.onlist_l_l {
						color: #aaaaaa;
					}

					.onlist_l_r {
						color: #000;
						margin-top: 10rpx;
						font-weight: 600;
					}
				}

				.onlist_right {
					display: flex;
					flex-direction: column;
					align-items: center;
					font-size: 26rpx;

					.onlist_r_l {
						color: #aaaaaa;
						padding-right: 30rpx;
					}

					.onlist_r_r {
						color: #000;
						// font-weight: 600;
						padding-right: 30rpx;
						margin-top: 10rpx;
					}
				}
			}

			.cars_xian {
				width: 96%;
				// height: 1rpx;
				border-style: dashed;
				/* 设置为虚线 */
				border-width: 1rpx;
				border-color: #AAAAAA;
				/* 边框颜色 */
				margin-top: 20rpx;
			}
		}

		.on_list {
			width: 96%;
			height: auto;
			background-color: #fff;
			border-radius: 20rpx;
			padding: 30rpx;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			margin-top: 20rpx;

			.on_list_left {
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				align-items: center;
				font-size: 26rpx;

				.on_list_l_l {
					color: #aaaaaa;
				}

				.on_list_l_r {
					color: #000;
				}
			}
		}

		.form {
			box-sizing: border-box;
			width: 96%;
			height: auto;
			background-color: #fff;
			border-radius: 20rpx;
			padding: 30rpx;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			margin-top: 20rpx;

			.item {
				padding: 10rpx 0;
				background-color: white;

				.item-con {
					flex: 1;
					width: 0;
					font-size: 26rpx;
					// padding: 40rpx 0;
					color: #333333;
					// border-bottom: 1px solid #EFEFEF;

					.pirce {
						color: #888888;
					}
				}

				radio {
					transform: scale(0.9);
				}
			}
		}

		.cars_text {
			padding: 20rpx 20rpx 100rpx 20rpx;
			font-size: 26rpx;

			.cars_t_w {
				color: #000;
				font-weight: 600;
				margin-top: 15rpx;
			}

			.cars_t_s {
				color: #aaaaaa;
				margin-top: 15rpx;
			}
		}
	}

	.cons_con {
		.add_list {
			position: relative;
			width: 710rpx;
			height: 420rpx;
			margin: 0 auto;

			.add_li_img {
				width: 710rpx;
				height: 420rpx;
				margin: 0 auto;
				background-color: #F4F9F9;
				padding: 20rpx;
			}

			.add_li_right {
				position: absolute;
				z-index: 9;
				right: 20rpx;
				width: 62rpx;
				height: 62rpx;
				border: 1rpx #b1b1b1 solid;
				top: 180rpx;
				background-color: #fff;
				line-height: 62rpx;
				text-align: center;
				margin-top: 62rpx;
				font-size: 26rpx;
			}

			.resize {
				color: #4BA677;
			}

			/* 根据索引值设置不同的垂直偏移 */
			.add_li_right:nth-child(1) {
				top: 30rpx;
			}

			.add_li_right:nth-child(2) {
				top: 60rpx;
				/* 根据需求调整偏移量 */
			}

			.add_li_right:nth-child(3) {
				top: 120rpx;
				/* 根据需求调整偏移量 */
			}
		}

		.conscon1 {
			padding: 0 0 20rpx 0;

			/deep/.u-tabs {
				background-color: #fff;
				// margin: 0 30rpx;

				.u-tabs__wrapper__nav__item {
					flex: 1;
				}

				.u-tabs__wrapper__nav__line {
					bottom: 0;
				}
			}
		}

		.box_1 {
			// box-shadow: 0px 0px 10px 0px rgba(32, 64, 48, 0.12);
			background-color: rgba(255, 255, 255, 1.0);
			display: flex;
			flex-direction: column;
			padding: 29rpx 12rpx 18rpx 20rpx;
		}

		.box_4 {
			background-color: rgba(255, 255, 255, 1.0);
			border-radius: 12rpx;
			display: flex;
			flex-direction: row;
			padding: 0 0 20rpx 0;
		}

		.image-text_1 {
			width: 177rpx;
			flex-direction: row;
			display: flex;
			justify-content: space-between;
		}

		.section_1 {
			background-color: rgba(75, 166, 119, 1.0);
			border-radius: 12rpx;
			width: 6rpx;
			height: 26rpx;
			display: flex;
			flex-direction: column;
			margin: 8rpx 0 8rpx 0;
		}

		.text-group_1 {
			overflow-wrap: break-word;
			color: #333333;
			font-size: 28rpx;
			font-family: PingFangSC-Medium;
			font-weight: 500;
			text-align: left;
			white-space: nowrap;
			line-height: 40rpx;
		}

		.list_1 {
			// height: 960rpx;
			margin-right: 8rpx;
			display: flex;
			flex-direction: column;
		}

		.list-items_1-0 {
			width: 710rpx;
			background-size: 100% 100%;
			flex-direction: row;
			display: flex;
			justify-content: space-between;
			padding: 0 30rpx 0 30rpx;
			background: #F4F9F9;
			border-radius: 20rpx;
			align-items: center;
			height: 180rpx;
		}

		.list-items_1-1 {
			width: 100%;
			background-size: 100% 100%;
			flex-direction: row;
			display: flex;
			justify-content: space-between;
			background: #F4F9F9;
			border-radius: 20rpx;
			align-items: center;
			padding: 0 50rpx;
		}

		.list-items_1-6 {
			flex-direction: column;
			display: flex;
			align-items: center;
			justify-content: center;
		}


		.text_3-0 {
			overflow-wrap: break-word;
			color: rgba(102, 102, 102, 1);
			font-size: 26rpx;
			font-family: PingFangSC-Regular;
			font-weight: normal;
			text-align: left;
			white-space: nowrap;
			line-height: 37rpx;
		}

		.text_3-1 {
			background-color: #7C9789;
			border-radius: 12rpx;
			width: 1rpx;
			height: 25rpx;
			display: flex;
			flex-direction: row;
		}

		.text_3-2 {
			background-color: #7C9789;
			border-radius: 12rpx;
			width: 1rpx;
			height: 25rpx;
			display: flex;
			flex-direction: row;
		}

		.text_4-0 {
			overflow-wrap: break-word;
			color: rgba(102, 102, 102, 1);
			font-size: 26rpx;
			font-family: PingFangSC-Regular;
			font-weight: normal;
			text-align: left;
			white-space: nowrap;
			line-height: 37rpx;
			margin: 0 0 0 20rpx;
		}

		.text_4-1 {
			overflow-wrap: break-word;
			color: rgba(102, 102, 102, 1);
			font-size: 26rpx;
			font-family: PingFangSC-Regular;
			font-weight: normal;
			text-align: left;
			white-space: nowrap;
			line-height: 37rpx;
			margin: 0 0 0 20rpx;
		}

		.text_5 {
			overflow-wrap: break-word;
			color: rgba(114, 158, 135, 1);
			font-size: 26rpx;
			font-family: PingFangSC-Regular;
			font-weight: normal;
			text-align: center;
			white-space: nowrap;
			line-height: 26rpx;
		}
	}

	.bottom-add-btn {
		position: fixed;
		width: 100%;
		height: 10vh;
		left: 0;
		bottom: 180rpx;
		padding: 20rpx 30rpx;
		// background-color: white;
		// margin-bottom: 130rpx;
	}

	.bottom-addbtn {
		// position: fixed;
		width: 100%;
		height: 6vh;
		// left: 0;
		// bottom: 180rpx;
		padding: 20rpx 30rpx 0rpx 30rpx;
		// background-color: white;
		// margin-bottom: 20rpx;
		margin-top: 20rpx;
	}

	.checkbox .wx-checkbox-input {
		border-radius: 26upx;
		/* 圆角 */
		width: 26upx;
		/* 背景的宽 */
		height: 26upx;
		/* 背景的高 */
		border: 1px solid #ccc;
		background: #eee;
	}

	/* 复选框禁用样式 */
	.checkbox .wx-checkbox-input-disabled {
		border-radius: 26upx;
		/* 圆角 */
		width: 26upx;
		/* 背景的宽 */
		height: 26upx;
		/* 背景的高 */
		background: #F2F7F5;
		border: 1px solid rgba(201, 201, 201, 1);
	}

	/* 复选框选中后样式 */
	.checkbox .wx-checkbox-input.wx-checkbox-input-checked {
		background: rgba(255, 129, 92, 1);
		border: 1px solid rgba(255, 129, 92, 1);
	}

	/*checkbox选中后图标样式 */
	.checkbox .wx-checkbox-input.wx-checkbox-input-checked::before {
		width: 26upx;
		height: 26upx;
		line-height: 26upx;
		text-align: center;
		font-size: 24upx;
		color: #fff;
		background: transparent;
		transform: translate(-50%, -50%) scale(1);
		-webkit-transform: translate(-50%, -50%) scale(1);
	}

	/deep/ checkbox .wx-checkbox-input {
		border-radius: 50% !important;
		color: #ffffff !important;
	}

	/deep/ checkbox .wx-checkbox-input.wx-checkbox-input-checked {
		color: #fff;
		background: linear-gradient(270deg, #47B37B 0%, #69D19B 100%), #4BA677;
		border: 1px solid rgba(255, 255, 255, 1.0);
	}

	/deep/.wx-checkbox-input.wx-checkbox-input-checked {
		// border: none !important;
	}

	.store-popup {
		padding: 20rpx 0;

		.item {
			margin-top: 30rpx;

			.info {
				margin-left: 20rpx;

				.name {
					font-size: 26rpx;
					font-weight: 500;
					color: #333333;
				}

				.phone {
					font-size: 24rpx;
					font-weight: 500;
					color: #bebebe;
					margin-top: 10rpx;
				}
			}
		}

		.title {
			padding: 0px 30rpx;
			padding-bottom: 20rpx;
			margin-bottom: 20rpx;
			border-bottom: 1px solid #cccccc;
			font-weight: bold;

			.clo {
				color: #000000;
			}
		}

		.list-1 {
			height: 40vh;
			overflow: auto;
			padding-bottom: 30rpx;

			.item {
				margin-top: 30rpx;
				height: 160rpx;
				padding: 0px 30rpx;
				overflow: hidden;

				.item-1 {
					background: #ffeae9;
					width: 35%;
					height: 100%;
					display: flex;
					border-radius: 9px 0 0 9px;
					flex-direction: column;
					align-items: center;
					border-right: 1px dashed #ff1c1c;
					justify-content: center;
					position: relative;

					&::before {
						position: absolute;
						content: "";
						width: 30rpx;
						height: 30rpx;
						background-color: white;
						border-radius: 50%;
						top: -15rpx;
						right: -15rpx;
					}

					&::after {
						position: absolute;
						content: "";
						width: 30rpx;
						height: 30rpx;
						background-color: white;
						border-radius: 50%;
						bottom: -15rpx;
						right: -15rpx;
					}

					.price {
						font-size: 26rpx;
						font-weight: 500;
						color: #ff1c1c;

						text {
							font-size: 40rpx;
							font-weight: 700;
						}
					}

					.price-1 {
						font-size: 22rpx;
						font-weight: bold;
						color: #ff1c1c;
						margin-top: 10rpx;
					}
				}

				.item-2 {
					background: #f7f7fa;
					width: 0;
					flex: 1;
					height: 100%;
					display: flex;
					border-radius: 0 9px 9px 0;
					flex-direction: column;
					justify-content: center;
					padding-left: 40rpx;
					position: relative;

					&::before {
						position: absolute;
						content: "";
						width: 30rpx;
						height: 30rpx;
						background-color: white;
						border-radius: 50%;
						top: -15rpx;
						left: -15rpx;
					}

					&::after {
						position: absolute;
						content: "";
						width: 30rpx;
						height: 30rpx;
						background-color: white;
						border-radius: 50%;
						bottom: -15rpx;
						left: -15rpx;
					}

					.info-1 {
						font-size: 28rpx;
						font-weight: bold;
						color: #000000;
					}

					.info-2 {
						font-size: 24rpx;
						font-weight: bold;
						color: #bebebe;
						margin-top: 20rpx;
					}

					.radio {
						position: absolute;
						right: 30rpx;
					}
				}
			}
		}

		.btn {
			padding: 0px 30rpx;
			margin-top: 20rpx;
		}
	}
</style>